/**
 * 高阶组件：
 * 1：必须是一个函数
 * 2：参数是一个组件
 * 3：返回值也是一个组件
*/
import { Component } from 'react';

// 定义高阶组件
const withFetch = (ComposeComponent) => {
  return class extends Component {
    render () {
      return (
        <ComposeComponent {...this.props} />
      )
    }
  }
}

class MyData extends Component {
  render () {
    return (
      <div>
        MyData：{ this.props.data }
      </div>
    )
  }
}

// 引用上面高阶组件并将组件以参数形式传递给高阶组件
const WithFetch = withFetch(MyData);
export default class HighOrderComponent extends Component {
  render () {
    return (
      <div>
        HighOrderComponent:
        <WithFetch data={'hello high order component'} />
      </div>
    )
  }
}